<template>
    <div class="app">
        <h2>我是App组件</h2>
        <h2>School组件中的学校名称是:{{schoolName}}</h2>
        <button @click='getSchoolName'>点击获取学校姓名</button>
        <News />
        <School />
    </div>
</template>

<script>
    import News from './components/News'
    import School from './components/School'
    export default {
        name: 'App',
        components:{
            News,
            School
        },
        data() {
            return {
                schoolName:''
            }
        },
        methods:{
            getSchoolName(val){
                this.schoolName = val;

            }
        },
        mounted() {
            this.$eventBus.$on('school-name',this.getSchoolName)
        },
        beforeDestroy() {
            this.$eventBus.$off('school-name')
        }
    }
</script>

<style>
    .app{
        background-color: gray;
        padding: 30px;
    }
</style>